import React, { createRef, useEffect, useRef, useState } from 'react';
import styles from './index.module.scss';
import { observer, inject } from "mobx-react";
import { Link } from 'react-router-dom';
import CardStage from '../CardStage';
import { Input } from '@alifd/next';
import { runInAction } from 'mobx';
import CardDetail from '../CardDetail';
import { StageStatusCurrent, StageStatusNone, StageStatusFirstChild } from '../../models/card-stage';
import CardInput from '../CardDetail/CardInput';

function NormalCard(props: {
    cardId: string,
    cardModel: any
    colIndex: number
}) {
    const [childLen, setChildLen] = useState(0);
    useEffect(() => {
        // 看看有没有子节点
        props.cardModel.getCardData(props.cardId).then(currentNode => {
            if (currentNode) {
                var childLen = currentNode.cols.reduce((total, item) => {
                    return total + Object.keys(item.cards).length;
                }, 0);
                setChildLen(childLen);
            } else {
                console.error('不存在cardId' + props.cardId);
            }
            
        });
    }, [props.cardModel.currentCard]);
    return <div style={{
        marginTop: '10px'
    }} >
        {childLen == 0 ? <CardInput
            parentCardId={props.cardModel.currentCardId}
            colIndex={props.colIndex}
            cardId={props.cardId}
        /> : <CardDetail cardId={props.cardId} isFirst={true} colIndex={props.colIndex}></CardDetail>}
    </div>
}
export default inject('cardModel')(observer(NormalCard));